﻿<phone:PhoneApplicationPage 
    x:Class="Nok_Air.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="800" 
    d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="False">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
 
        <!--Panorama control-->
        <controls:Panorama Title="Nok Air">
            <controls:Panorama.Background>
                <ImageBrush ImageSource="Images/Background/PanoramaBackgroundv4.png"/>
            </controls:Panorama.Background>

            <!--Panorama item one-->
            <controls:PanoramaItem Header="Menu">
                <!--Double line list with text wrapping-->
                <StackPanel Orientation="Vertical" Width="432">
                    <!--Double line list with text wrapping-->
                    <ListBox ItemsSource="{Binding MenuItem}" d:LayoutOverrides="Width" Height="268">
                        <ListBox.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Margin="0,0,0,7" Width="432" Orientation="Horizontal">
                                    <Image Height="35"  Source="{Binding MenuIcon}" Width="60"/>
                                    <TextBlock Text="{Binding MenuTitle}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Width="311" VerticalAlignment="Center" HorizontalAlignment="Left" FontSize="34.667" Margin="0" FontFamily="/Nok Air;component/Fonts/Fonts.zip#Circular" Foreground="Black" FontWeight="Bold"/>
                                    <Image Height="60" Source="/Images/l_button.png" Width="40" Margin="10,0,0,0"/>
                                </StackPanel>
                            </DataTemplate>
                        </ListBox.ItemTemplate>
                    </ListBox>
                    <Image Margin="0,0,12,0" Height="175" Source="/Images/Promotion.jpg" Stretch="UniformToFill"/>

                </StackPanel>

            </controls:PanoramaItem>

            <!--Panorama item two-->
            <!--Use 'Orientation="Horizontal"' to enable a panel that lays out horizontally-->
            <controls:PanoramaItem Header="Airport">
                <!--Double line list with image placeholder and text wrapping-->
                <ListBox Margin="0,0,-12,0" ItemsSource="{Binding AirportItems}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Margin="0,0,0,17">
                                <!--Replace rectangle with image-->
                                <Image Height="100" Width="100" Margin="12,0,9,0" Source="{Binding AirPortIcon}"/>
                                <StackPanel Width="311">
                                    <TextBlock Text="{Binding AirPortName}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Foreground="Black" FontFamily="/Nok Air;component/Fonts/Fonts.zip#Circular" FontWeight="Bold"/>
                                    <TextBlock Text="{Binding AirPortLocat}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}" Foreground="#99000000" FontFamily="/Nok Air;component/Fonts/Fonts.zip#Circular"/>
                                </StackPanel>
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </controls:PanoramaItem>
        </controls:Panorama>
    </Grid>
 
    <!--Panorama-based applications should not show an ApplicationBar-->

</phone:PhoneApplicationPage>